<template>
	<view class="page">
		<!-- 功能区 -->
		<view class="area">
			<view class="area_title">功能区</view>
			<view class="area_boxs">
				<view class="area_box">
					<image src="../../static/img/personal/area_resources.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>房源</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_source.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>客源</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_house.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>新房</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_examine.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>审批</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_look.png" class="area_box_img" mode="aspectFill"></image>
					<span>带看</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_clock.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>打卡</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_out.png" class="area_box_img" mode="aspectFill"></image>
					<span>外出</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_entrust.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>业主委托</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_check.png" class="area_box_img" mode="aspectFill">
					</image>
					<span>看房单</span>
				</view>
				<view class="area_box">
					<image src="../../static/img/personal/area_all.png" class="area_box_img" mode="aspectFill"></image>
					<span>全部功能</span>
				</view>
			</view>
		</view>

		<!-- 行程看板 -->
		<view class="trip">
			<view class="trip_title">
				<view class="trip_title_left">
					<span>行程看板</span>
					<p>今天</p><i></i>
				</view>
				<view class="trip_title_right">
					查看更多<i></i>
				</view>
			</view>
			<view class="trip_boxs">
				<view class="trip_box">
					<p>1.6<em>k</em></p>
					<span>新增房源</span>
				</view>
				<view class="trip_box">
					<p>2.8<em>k</em></p>
					<span>新增客源</span>
				</view>
				<view class="trip_box">
					<p>231</em></p>
					<span>新增钥匙</span>
				</view>
				<view class="trip_box">
					<p>231</p>
					<span>新增带看</span>
				</view>

				<view class="trip_box">
					<p>125</p>
					<span>新增实勘</span>
				</view>
				<view class="trip_box">
					<p>60</p>
					<span>跟进次数</span>
				</view>
				<view class="trip_box">
					<p>99</p>
					<span>新增委托</span>
				</view>
				<view class="trip_box">
					<p>0.5<em>h</em></p>
					<span>有效通话</span>
				</view>
			</view>
			<view class="trip_footer">
				你已7天未分享，73%的经纪人连续分享两天后就会产省
			</view>
		</view>


		<!-- 营销发房 -->
		<view class="market">
			<view class="market_title">
				<view class="market_title_left">
					<span>营销发房</span>
				</view>
				<view class="market_title_right">
					更多方案<i></i>
				</view>
			</view>
			<div class="market_boxs">
				<div class="market_box">
					<image src="../../static/img/personal/market_img1.png" class="market_box_img" mode="aspectFill">
					</image>
				</div>
				<div class="market_box">
					<image src="../../static/img/personal/market_img2.png" class="market_box_img" mode="aspectFill">
					</image>
				</div>
				<div class="market_box">
					<image src="../../static/img/personal/market_img1.png" class="market_box_img" mode="aspectFill">
					</image>
				</div>
				<div class="market_box">
					<image src="../../static/img/personal/market_img2.png" class="market_box_img" mode="aspectFill">
					</image>
				</div>
			</div>
		</view>

		<!-- banner -->
		<view class="banner">
			<swiper class="swiper" indicator-dots="true" autoplay="true" circular="true" indicator-color="#919191"
				indicator-active-color="#ffffff">
				<swiper-item>
					<view class="swiper_item">
						<image src="../../static/img/personal/banner.png" class="swiper_item_img" mode="aspectFill">
						</image>
						<p>广告</p>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper_item">
						<image src="../../static/img/personal/banner.png" class="swiper_item_img" mode="aspectFill">
						</image>
					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper_item">
						<image src="../../static/img/personal/banner.png" class="swiper_item_img" mode="aspectFill">
						</image>
					</view>
				</swiper-item>

			</swiper>
		</view>


		<!-- 做任务赚积分 -->
		<view class="task">

			<view class="task_title">
				<view class="task_title_left">
					<span>做任务赚积分</span>
				</view>
				<view class="task_title_right">
					提醒
					<switch class="task_switch" color="#FE5700" style="transform:scale(0.6)" :checked="true" />
					<image src="../../static/img/personal/pop.png" class="pop_img" mode="aspectFill"></image>
				</view>
			</view>

			<view class="task_boxs">
				<view class="task_box">
					<image src="../../static/img/personal/task_img.png" class="task_img" mode="aspectFill"></image>
					<view class="task_box_left">
						<p>邀请用户签到</p>
						<span>邀请用户签到</span>
					</view>
					<view class="task_box_right">去提醒</view>
				</view>
				<view class="task_box">
					<image src="../../static/img/personal/task_img.png" class="task_img" mode="aspectFill"></image>
					<view class="task_box_left">
						<p>邀请用户签到</p>
						<span>邀请用户签到</span>
					</view>
					<view class="task_box_right">去提醒</view>
				</view>
			</view>

			<view class="task_more">
				更多任务<i></i>
			</view>

		</view>






		<!-- 课程上新 -->
		<view class="course">
			<view class="course_title">
				<view class="course_title_left">
					<span>课程上新</span>
				</view>
				<view class="course_title_right">
					更多课程<i></i>
				</view>
			</view>
			<image src="../../static/img/personal/course.png" class="course_img" mode="aspectFill"></image>
		</view>




		<!-- 最近学习 -->
		<view class="course">
			<view class="course_title">
				<view class="course_title_left">
					<span>最近学习</span>
				</view>
				<view class="course_title_right">
					查看更多<i></i>
				</view>
			</view>

			<view class="study">
				<image src="../../static/img/personal/study.png" class="study_img" mode="aspectFill"></image>
				<p>格物生命之理，致知演化之道<span>已学1%</span></p>
			</view>
		</view>


		<!-- 营销思维“T”索营 -->
		<view class="course">
			<view class="course_title">
				<view class="course_title_left">
					<span>营销思维“T”索营</span>
				</view>
				<view class="course_title_right">
					查看更多<i></i>
				</view>
			</view>
			<view class="marketing_title">三大主题·6天小班·教练护航</view>
			<view class="marketing_box">
				<image src="../../static/img/personal/marketing1.png" class="marketing_img" mode="aspectFill"></image>
				<image src="../../static/img/personal/marketing2.png" class="marketing_img" mode="aspectFill"></image>
				<image src="../../static/img/personal/marketing3.png" class="marketing_img" mode="aspectFill"></image>
			</view>
		</view>


		<!-- 其他工具 -->
		<view class="course">
			<view class="course_title">
				<view class="course_title_left">
					<span>其他工具</span>
				</view>
			</view>
			<view class="tool">
				<p>
					<image src="../../static/img/personal/tool_feedback.png" class="tool_img" mode="aspectFill"></image>
					<span>意见反馈</span>
				</p>
				<p>
					<image src="../../static/img/personal/tool_agreement.png" class="tool_img" mode="aspectFill">
					</image>
					<span>相关协议</span>
				</p>
				<p>
					<image src="../../static/img/personal/tool_cooperate.png" class="tool_img" mode="aspectFill">
					</image>
					<span>商务合作</span>
				</p>
				<p>
					<image src="../../static/img/personal/tool_about.png" class="tool_img" mode="aspectFill"></image>
					<span>关于我们</span>
				</p>
			</view>
		</view>


		<!-- 底部 -->
		<view class="footer">
			<image src="../../static/img/personal/logo.png" class="footer_img" mode="aspectFill"></image>
			<p>客服电话<i>400-065-5788</i>工作时间9:30-18:30<br />增值电信业务经营许可证:苏B2-20201612<br />苏ICP证150923号</p>
		</view>



	</view>
</template>

<script>
	export default {
		data() {
			return {}
		},
		onLoad(e) {
			let that = this;
		},
		methods: {
			_navigateTo(e) {
				uni.navigateTo({
					url: e
				});
			},
			api_block() {
				let that = this
				that.api.post('cr/block/' + that.lsid + '/0').then(res => {

					uni.showToast({
						title: "已移出黑名单",
						icon: 'none'
					})
					that.qd = false
					that.api_crbkl();
				})
			},
			_tag1(e) {
				let that = this
				that.api.get('cr/list', {
					pageNum: that.pageNum,
					pageSize: that.pageSize
				}).then(res => {
					that.tag1 = res.data.content
				})
			},

		}
	}
</script>

<style>
	page {
		background-color: #f4f4f4;
	}

	.footer {
		width: 686rpx;
		height: 436rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: block;
		float: left;
		margin: 16rpx 32rpx 16rpx;
	}

	.footer_img {
		width: 325rpx;
		height: 81rpx;
		display: block;
		float: left;
		margin: 86rpx 0 62rpx 164rpx;
	}

	.footer p {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #BEBEBE;
		line-height: 35rpx;
	}

	.footer p i {
		color: #FF830E;
		display: inline;
	}


	.tool {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 28rpx 0 40rpx;
	}

	.tool p {
		width: 100rpx;
		height: auto;
		display: block;
		float: left;
		margin: 30rpx 35.75rpx 0;
	}

	.tool_img {
		width: 48rpx;
		height: 48rpx;
		display: block;
		float: left;
		margin: 0 26rpx 24rpx;
	}

	.tool p span {
		width: 100rpx;
		height: auto;
		display: block;
		float: left;
		text-align: center;
		font-size: 23rpx;
		color: #000000;
	}


	.marketing_title {
		width: auto;
		height: auto;
		display: block;
		float: left;
		margin: 40rpx 0 0 26rpx;
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
	}

	.marketing_box {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 28rpx 0 40rpx;
	}

	.marketing_img {
		width: 197rpx;
		height: 200rpx;
		display: block;
		float: left;
		margin: 0 0 0 22rpx;
	}

	.study {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 40rpx 0 40rpx;
	}

	.study_img {
		width: 32rpx;
		height: 32rpx;
		display: block;
		float: left;
		margin: 0 16rpx 0 25rpx;
	}

	.study p {
		width: 580rpx;
		height: auto;
		display: block;
		float: left;
		font-size: 25rpx;
		color: #000000;
	}

	.study p span {
		width: 580rpx;
		height: auto;
		display: block;
		float: left;
		font-size: 23rpx;
		margin: 25rpx 0 0 0;
		color: #919191;
	}

	.task_more {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 0 0 40rpx;
		text-align: center;
		font-size: #919191;
		font-size: 26rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #919191;
	}

	.task_more i {
		width: 18rpx;
		height: 11rpx;
		display: inline-block;
		margin: 0 0 3rpx 14rpx;
		background: url(../../static/img/personal/more_down.png) no-repeat;
		background-size: 100%;
	}

	.task_boxs {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 20rpx 0 20rpx;
	}

	.task_box {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 20rpx 0 0;
	}

	.task_img {
		width: 76rpx;
		height: 76rpx;
		display: block;
		float: left;
		margin: 0 19rpx 0 25rpx;
		border-radius: 76rpx;
	}

	.task_box_left {
		width: auto;
		height: 76rpx;
		line-height: 76rpx;
		display: block;
		float: left;
		margin: 0 0 0 0;
	}

	.task_box_left p {
		width: auto;
		height: 76rpx;
		line-height: 76rpx;
		display: block;
		float: left;
		margin: 0 0 0 0;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
	}

	.task_box_left span {
		width: auto;
		height: 76rpx;
		line-height: 76rpx;
		display: block;
		float: left;
		margin: 0 0 0 0;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FF0000;
	}

	.task_box_right {
		width: 120rpx;
		height: 56rpx;
		background: #F7DCB1;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		opacity: 1;
		display: block;
		float: right;
		text-align: center;
		line-height: 56rpx;
		font-size: 24rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #6F3F2B;
		margin: 10rpx 25rpx 0 0;
	}




	.task_switch {
		margin: -10rpx -30rpx 0 -10rpx;
	}

	.task {
		width: 686rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: block;
		float: left;
		margin: 16rpx 32rpx 16rpx;
	}

	.task_title {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		padding: 26rpx 24rpx 0 24rpx;
		box-sizing: border-box;
	}

	.task_title_left {
		width: auto;
		height: auto;
		display: block;
		float: left;
	}

	.task_title_left span {
		width: auto;
		height: 36rpx;
		display: block;
		float: left;
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		line-height: 36rpx;
		margin: 0 16rpx 0 0;
	}

	.pop_img {
		width: 98rpx;
		height: 40rpx;
		display: block;
		position: absolute;
		top: -40rpx;
		right: -22rpx;
	}


	.task_title_right {
		width: auto;
		height: 34rpx;
		display: block;
		float: right;
		line-height: 34rpx;
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		position: relative;
	}





	.course_img {
		width: 638rpx;
		height: 228rpx;
		background: #FFFFFF;
		display: block;
		float: left;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin: 24rpx 24rpx 24rpx;
	}

	.course {
		width: 686rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: block;
		float: left;
		margin: 16rpx 32rpx 16rpx;
	}

	.course_title {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		padding: 26rpx 24rpx 0 24rpx;
		box-sizing: border-box;
	}

	.course_title_left {
		width: auto;
		height: auto;
		display: block;
		float: left;
	}

	.course_title_left span {
		width: auto;
		height: 36rpx;
		display: block;
		float: left;
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		line-height: 36rpx;
		margin: 0 16rpx 0 0;
	}




	.course_title_right {
		width: auto;
		height: 34rpx;
		display: block;
		float: right;
		line-height: 34rpx;
		font-size: 24rpx;
		color: #919191;
	}

	.course_title_right i {
		width: 10.5rpx;
		height: 17.5rpx;
		display: block;
		float: right;
		margin: 8rpx 0 0 14rpx;
		background: url(../../static/img/personal/right.png) no-repeat;
		background-size: 100%;
	}




	.swiper {
		width: 686rpx;
		height: 140rpx;
		display: block;
		float: left;
		border-radius: 8rpx;
		overflow: hidden;
		margin: 20rpx 0 0;
	}

	.swiper_item {
		width: 686rpx;
		height: 140rpx;
		display: block;
		float: left;
		position: relative;
	}

	.swiper_item_img {
		width: 686rpx;
		height: 140rpx;
		display: block;
		float: left;
	}

	.banner {
		width: 686rpx;
		height: 180rpx;
		background: #FFFFFF;
		display: block;
		float: left;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin: 0 32rpx;
	}

	.banner p {
		width: auto;
		height: 26rpx;
		padding: 0 5rpx;
		font-size: 18rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		display: block;
		position: absolute;
		bottom: 9rpx;
		right: 24rpx;
		border-radius: 3rpx;
		background: rgba(0, 0, 0, 0.3);
	}

	.market_boxs {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 32rpx 0 16rpx 0;
	}

	.market_box {
		width: 308rpx;
		height: 140rpx;
		display: block;
		float: left;
		margin: 0 0 20rpx 23rpx;
	}

	.market_box_img {
		width: 308rpx;
		height: 140rpx;
		display: block;
		float: left;
	}

	.market {
		width: 686rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: block;
		float: left;
		margin: 16rpx 32rpx 16rpx;
	}

	.market_title {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		padding: 26rpx 24rpx 0 24rpx;
		box-sizing: border-box;
	}

	.market_title_left {
		width: auto;
		height: auto;
		display: block;
		float: left;
	}

	.market_title_left span {
		width: auto;
		height: 36rpx;
		display: block;
		float: left;
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		line-height: 36rpx;
		margin: 0 16rpx 0 0;
	}




	.market_title_right {
		width: auto;
		height: 34rpx;
		display: block;
		float: right;
		line-height: 34rpx;
		font-size: 24rpx;
		color: #919191;
	}

	.market_title_right i {
		width: 10.5rpx;
		height: 17.5rpx;
		display: block;
		float: right;
		margin: 8rpx 0 0 14rpx;
		background: url(../../static/img/personal/right.png) no-repeat;
		background-size: 100%;
	}




	.trip_footer {
		width: 100%;
		height: 90rpx;
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		line-height: 90rpx;
		text-align: center;
		border-top: 1px solid rgba(190, 190, 190, 0.5);
		;
		display: block;
		float: left;
	}

	.trip_boxs {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		margin: 32rpx 0 8rpx;
	}

	.trip_box {
		width: 100rpx;
		height: auto;
		display: block;
		float: left;
		margin: 0 35.75rpx 24rpx;
	}

	.trip_box p {
		width: 100%;
		height: 50rpx;
		line-height: 50rpx;
		display: block;
		float: left;
		margin: 0 0 2rpx;
		text-align: center;
		font-size: 36rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #000000;
	}

	.trip_box p em {
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		font-style: normal;
		margin: 0 0 0 4rpx;
		display: inline;
	}

	.trip_box span {
		font-size: 22rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		width: 100%;
		height: auto;
		display: block;
		float: left;
		text-align: center;
	}

	.trip {
		width: 686rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: block;
		float: left;
		margin: 0 32rpx 0;
	}

	.trip_title {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		padding: 26rpx 24rpx 0 24rpx;
		box-sizing: border-box;
	}

	.trip_title_left {
		width: auto;
		height: auto;
		display: block;
		float: left;
	}

	.trip_title_left span {
		width: auto;
		height: 36rpx;
		display: block;
		float: left;
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		line-height: 36rpx;
		margin: 0 16rpx 0 0;
	}

	.trip_title_left p {
		width: auto;
		height: 36rpx;
		display: block;
		float: left;
		font-size: 22rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #000000;
		line-height: 36rpx;
		margin: 0 8rpx 0 0;
	}

	.trip_title_left i {
		width: 12rpx;
		height: 8rpx;
		display: block;
		float: left;
		margin: 12rpx 0 0 0;
		background: url(../../static/img/personal/down.png) no-repeat;
		background-size: 100%;
	}


	.trip_title_right {
		width: auto;
		height: 34rpx;
		display: block;
		float: right;
		line-height: 34rpx;
		font-size: 24rpx;
		color: #919191;
	}

	.trip_title_right i {
		width: 10.5rpx;
		height: 17.5rpx;
		display: block;
		float: right;
		margin: 8rpx 0 0 14rpx;
		background: url(../../static/img/personal/right.png) no-repeat;
		background-size: 100%;
	}


	.area {
		width: 686rpx;
		height: auto;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		opacity: 1;
		display: block;
		float: left;
		margin: 24rpx 32rpx 16rpx;
		padding-bottom: 28rpx;
	}

	.area_title {
		width: 100%;
		height: auto;
		line-height: 36rpx;
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #000000;
		display: block;
		float: left;
		padding: 26rpx 0 28rpx 24rpx;
		box-sizing: border-box;
	}

	.area_boxs {
		width: 100%;
		height: auto;
		display: block;
		float: left;
	}

	.area_box {
		width: 104rpx;
		height: auto;
		display: block;
		float: left;
		margin: 4rpx 16.6rpx 36rpx;
	}

	.area_box_img {
		width: 56rpx;
		height: 56rpx;
		display: block;
		float: left;
		margin: 0 24rpx 10rpx;
	}

	.area_box span {
		width: 100%;
		height: auto;
		display: block;
		float: left;
		font-size: 22rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #000000;
		line-height: 44rpx;
		text-align: center;
	}



	.page {
		width: 100vw;
		height: auto;
		display: block;
		float: left;
		background-color: #f4f4f4;
	}
</style>